<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        //执行下面代码，按什么顺序将数字1-4输入到控制台
        (function () {
            console.log(1);
            setTimeout(function () {
                console.log(2)
            }, 1000);
            setTimeout(function () {
                console.log(3)
            }, 0);
            console.log(4);
        })();
        // 这些值将按以下顺序记录:
        // 1
        // 4
        // 3
        // 2
        // 我们先来解释一下这 些可能更为明显的部分: ●首先显示1和4， 因为它们是通过简单调用console.log() 而没有任何
        // 延迟记录的● 在3之后显示， 因为在延迟1000毫秒(即1秒) 之后记录2， 而在0
        // 毫秒的延迟之后记录3。
        // 好的。 但是， 如果在延迟0毫秒后记录3, 这是否意味着它正在被立即
        // 记录 ? 而且， 如果是这样， 不应该在4之前记录它， 因为4是由后面的
        // 代码行记录的吗 ?
        //     答案与正确理解JavaScript事件和时间有关。
        // 浏览器有一 - 个事件循环， 它检查事件队列并处理未决事件。 例如， 如
        // 果在浏览器繁忙时(例如， 处理onclick) 在后台发生事件(例如脚本 onload事件)， 则该事件被附加到队列中。 当onclick处 理程序完成
        // 时， 将检查队列并处理该事件(例如， 执行onload脚本)。
        // 同样， 如果浏览器繁忙， setTimeout() 也会将其引 | 用函数的执行放入
        // 事件队列中。.
        // 当值为零作为setTimeout() 的第二个参数传递时， 它将尝试“ 尽快”
        // 执行指定的函数。 具体来说， 函数的执行放置在事件队列中， 以在下
        //     -
        //     个计时器滴答时发生。 但请注意， 这不是直接的;
        // 该功能不会执行，
        // 直到下一 - 个滴答声。 这就是为什么在上面的例子中， 调用console.log(4) 发生在调用console.log(3) 之前(因为调用console.log(
        //     3) 是通过 setTimeout调用的， 所以稍微延迟了一点)。
    </script>
</body>

</html>